import { Typography } from 'antd';
import React from 'react';
import './index.less';
import { history } from 'umi';
import configs from '../../../config/env';
interface HotArticleProps {
  imgUrl: string | null;
  title: string;
  id: number;
}
const HotArticle: React.FC<HotArticleProps> = (props) => {
  const { imgUrl, title, id }: HotArticleProps = props;
  const toDetail = (id: number) => {
    // history.push('/blog-detail/' + id);
    window.open('/blog-detail/' + id);
  };
  return (
    <div
      className="hot_article_wrapper"
      onClick={() => {
        toDetail(id);
      }}
    >
      <div className="left_img">
        <img
          src={
            imgUrl
              ? configs[process.env.API_ENV as any].API_SERVER + imgUrl
              : '/images/conquering-the-summit-of-london-1.jpg'
          }
          alt=""
        />
      </div>
      <div className="right_tit">
        <Typography.Paragraph ellipsis={{ rows: 2 }}>{title}</Typography.Paragraph>
      </div>
    </div>
  );
};
export default HotArticle;
